<template>
  <div class="app-container">
    <!-- <div class="header_title_box">
      <h2>库存盘点</h2>
    </div> -->
    <!-- 搜索 -->
    <!-- <div class="select_form_box mb16">
      <div class="filter-container">
        <el-input v-model="queryParam.name"  placeholder="盘点名称" class="input-with-select mr64" @keyup.enter.native="handleSearch" />
        <el-select v-model="queryParam.status" placeholder="状态" clearable class="input-with-select mr16" @change="handleSearch">
          <el-option v-for="item in statusList" :key="item.id" :value="item.id" :label="item.name" />
        </el-select>
        <el-button  type="primary" class="filter-item search" icon="el-icon-search" @click="handleSearch">
          搜索
        </el-button>
        <el-button  icon="el-icon-refresh" @click="handleRefresh">重置</el-button>
      </div>
    </div> -->
    <form-selections :is-active="isActive" :items="formItems" :query-param.sync="queryParam" display="block" @handleSearch="handleSearch" />
    <div class="select_flex">
      <div class="operation_button_box">
        <el-button v-action="'checkOrder@save'" size="small" type="primary" icon="el-icon-circle-plus-outline" @click="toAddCheckOrder">创建盘库单</el-button>
        <el-button v-action="'checkOrder@delete'" size="small" type="danger" @click="dels(0)">批量删除</el-button>
        <el-button v-action="'checkOrder@updateWarehouseGoodsStock'" size="small" type="primary" @click="editCheckOrderResult">盘点结果录入</el-button>
        <el-button v-action="'checkOrder@export'" size="small" type="primary" :loading="exportLoading" @click="handleExport">导出</el-button>
      </div>
      <div>
        <el-button size="small" type="primary" class="filter-item search" icon="el-icon-search" @click="handleSearch">
          搜索
        </el-button>
        <el-button size="small" icon="el-icon-refresh" @click="handleRefresh">重置</el-button>
      </div>
    </div>
    <div v-loading="loading">
      <el-table :data="data" border fit :row-class-name="tableRowClassName" :max-height="screenHeigh" @selection-change="handleSelectMulti">
        <el-table-column type="selection" width="51" align="center" />
        <el-table-column label="操作" align="center" width="135" fixed>
          <template slot-scope="scope">
            <span v-if="scope.row.status === 0" v-action="'checkOrder@update'" class="edit_style" style="margin: 0;" @click="handleUpdate(scope.row)">编辑</span>
            <span v-if="scope.row.status === 0" v-action="'checkOrder@delete'" class="delete_style" style="margin: 0;" @click="dels(scope.row.id)">删除</span>
          </template>
        </el-table-column>
        <el-table-column label="盘库单号" prop="code" align="center" width="203">
          <template slot-scope="scope">
            <code-item :code="scope.row.code" @click="toInfo(scope.row.id)" />
          </template>
        </el-table-column>
        <el-table-column label="盘库名称" prop="name" align="center" width="184" />
        <el-table-column label="实体仓" prop="warehouse" align="center" width="187" />
        <el-table-column label="状态" prop="status" align="center" width="176">
          <template slot-scope="scope">
            <span>{{ statusMap[scope.row.status] }}</span>
          </template>
        </el-table-column>
        <el-table-column label="库存差异" prop="stock_difference" align="center" width="193" />
        <el-table-column label="创建人" prop="created_by_name" align="center" width="112" />
        <el-table-column label="创建时间" prop="created_at" align="center" width="174" />
        <el-table-column label="修改人" prop="updated_by_name" align="center" width="112" />
        <el-table-column label="修改时间" prop="updated_at" align="center" width="174" />
      </el-table>
      <el-pagination v-if="paginate.total > 0" class="pagination_box" background :current-page="paginate.current" :page-sizes="[10, 20, 30, 40]" layout="total, sizes, prev, pager, next, jumper" :total="paginate.total" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
    </div>
    <!--下载字段选择-->
    <DownModul :url="exportUrl" :search-param="downLoadParams" :form-visible-down.sync="formVisibleDown" titel="出库盘点导出字段选择" :options-modul="optionsModul" />
  </div>
</template>

<script>
import formOperate from '../../../layout/mixin/formOperate'
import { action } from '@/directive/permission/index.js' // 权限判断指令
import codeItem from '../../../components/base/code'
import cacheList from '@/layout/mixin/cacheList'
import DownModul from '@/components/DownModul/index.vue'
export default {
  name: 'CheckOrder',
  directives: {
    action
  },
  components: {
    codeItem,
    DownModul
  },
  mixins: [formOperate, cacheList],
  data() {
    return {
      otherHeight: 355,
      componentName: 'CheckOrder',
      url: '/check-order',
      formItems: [
        {
          label: '盘点名称',
          key: 'name',
          type: 'input',
          placeholder: '请输入盘点名称'
        },
        {
          label: '状态',
          key: 'status',
          type: 'select',
          filterable: true,
          placeholder: '请选择状态',
          options: [
            {
              value: 0,
              label: '待盘库'
            },
            {
              value: 1,
              label: '已盘库'
            }
          ]
        }
      ],
      queryParam: {
        name: '',
        status: '',
        page: 1,
        limit: 10
      },
      statusList: [
        {
          id: 0,
          name: '待盘库'
        },
        {
          id: 1,
          name: '已盘库'
        }
      ], // 审核状态list
      statusMap: {
        0: '待盘库',
        1: '已盘库'
      },
      exportUrl: '/check-order-export',
      cachePaths: [
        '/storage/checkOrder/',
        '/storage/checkOrder/result/'
      ],
      optionsModul: [
        {
          key: 'code',
          label: '盘点单号'
        },
        {
          key: 'name',
          label: '盘库名称'
        },
        {
          key: 'warehouse',
          label: '实体仓'
        },
        {
          key: 'status_text',
          label: '审核状态'
        },
        {
          key: 'stock_difference',
          label: '库存差异'
        },
        {
          key: 'created_by_name',
          label: '创建人'
        },
        {
          key: 'created_at',
          label: '创建时间'
        }
      ]
    }
  },
  activated() {
    this.getList()
  },
  methods: {
    // 导出
    handleExport() {
      const vm = this
      const { name, status, source } = vm.queryParam
      const params = { name, status, source }
      // vm.handleExportxlsx(vm.exportUrl, params)
      vm.downLoadParams = params
      vm.formVisibleDown = true
    },
    // 添加
    toAddCheckOrder() {
      const vm = this
      vm.$router.push({ path: '/storage/checkOrder/add' })
    },
    // 批量删除
    dels(id) {
      const vm = this
      let ids = []
      if (id) {
        ids.push(id.toString())
      } else {
        ids = vm.selectedIds.map((e) => e.toString())
      }
      vm.$confirm(`确定${id ? '' : '批量'}删除吗？`, '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        vm.$http.post('/check-order/delete', { ids }).then((res) => {
          vm.$message.success('删除成功')
          vm.getList()
        })
      })
    },
    // 修改
    handleUpdate(row) {
      const vm = this
      vm.$router.push({ path: `/storage/checkOrder/add/${row.id}`, query: { title: '编辑盘库单' }})
    },
    // 盘点结果录入
    editCheckOrderResult() {
      const vm = this
      if (vm.selectedIds.length <= 0) {
        vm.$message.error('请至少选择一条数据')
        return
      }
      if (vm.selectedIds.length > 1) {
        vm.$message.error('请至多选择一条数据')
        return
      }
      const firstId = vm.selectedIds[0]
      const first = vm.data.find((e) => e.id === firstId)
      vm.toEdit(first.id)
    },
    // 去查看详情
    toInfo(id) {
      const vm = this
      vm.$router.push({ path: `/storage/checkOrder/result/${id}/info` })
    },
    toEdit(id) {
      const vm = this
      vm.$router.push({ path: `/storage/checkOrder/result/${id}` })
    }
  }
}
</script>

<style lang="scss" scoped>
</style>
